/**
 * MathJax工具函数集
 * 提供数学公式渲染相关的功能
 */

/**
 * 加载MathJax库并配置
 * @param {Function} callback 加载完成后的回调函数
 * @returns {Promise} 返回Promise以便使用async/await方式调用
 */
export function loadMathJax() {
  return new Promise((resolve) => {
    console.log('开始渲染公式')
    
    // 如果已经加载，则直接返回
    if (window.MathJax) {
      console.log('MathJax已加载', window.MathJax)
      
      // 确保MathJax已完全初始化
      if (window.MathJax.Hub && typeof window.MathJax.Hub.Queue === 'function') {
        resolve(window.MathJax)
        return
      } else {
        console.warn('MathJax加载不完整，尝试重新配置')
      }
    }
    
    // 创建script标签加载MathJax
    const script = document.createElement('script')
    script.src = 'https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.9/MathJax.js?config=TeX-AMS_HTML'
    script.async = true
    
    // 加载完成后配置MathJax
    script.onload = () => {
      if (!window.MathJax) {
        console.error('MathJax加载失败')
        resolve(null)
        return
      }
      
      // 配置MathJax
      window.MathJax.Hub.Config({
        tex2jax: {
          inlineMath: [['$', '$'], ['\\(', '\\)']],
          displayMath: [['$$', '$$'], ['\\[', '\\]']],
          processEscapes: true,
          processEnvironments: true,
        },
        displayAlign: 'center',
        showProcessingMessages: false, // 不显示处理消息
        messageStyle: 'none', // 不显示消息
        'HTML-CSS': {
          styles: {'.MathJax_Display': {"margin": 0}},
          linebreaks: {automatic: true},
          scale: 100,
        },
      })
      
      console.log('MathJax配置完成')
      resolve(window.MathJax)
    }
    
    // 加载失败处理
    script.onerror = () => {
      console.error('MathJax加载失败')
      resolve(null)
    }
    
    // 添加到页面
    document.head.appendChild(script)
  })
}

/**
 * 渲染页面中的数学公式
 * @param {HTMLElement} element 要渲染的DOM元素，不传则渲染整个文档
 * @returns {Promise} 操作完成后的Promise
 */
export function renderMathJax(element = null) {
  return new Promise(async (resolve) => {
    try {
      const mathJax = await loadMathJax()
      
      if (!mathJax || !mathJax.Hub || !mathJax.Hub.Queue) {
        console.error('找不到MathJax的渲染方法')
        resolve(false)
        return
      }
      
      if (element) {
        // 渲染指定元素
        mathJax.Hub.Queue(['Typeset', mathJax.Hub, element])
      } else {
        // 渲染整个文档
        mathJax.Hub.Queue(['Typeset', mathJax.Hub])
      }
      
      // 给MathJax一些时间完成渲染
      setTimeout(() => {
        console.log('数学公式渲染完成')
        resolve(true)
      }, 100)
    } catch (error) {
      console.error('渲染数学公式时出错:', error)
      resolve(false)
    }
  })
}

/**
 * 安全渲染数学公式，防止渲染失败导致页面崩溃
 * @param {HTMLElement} element 要渲染的DOM元素
 * @param {number} maxRetries 最大重试次数
 * @returns {Promise} 操作完成后的Promise
 */
export function safeRenderMathJax(element = null, maxRetries = 3) {
  return new Promise(async (resolve) => {
    let retries = 0
    let success = false
    
    while (!success && retries < maxRetries) {
      try {
        success = await renderMathJax(element)
      } catch (error) {
        console.warn(`MathJax渲染失败，第${retries + 1}次重试`, error)
      }
      retries++
      
      if (!success && retries < maxRetries) {
        // 等待一段时间再重试
        await new Promise(r => setTimeout(r, 300))
      }
    }
    
    resolve(success)
  })
}

/**
 * 格式化含有数学公式的HTML内容
 * @param {string} html HTML内容
 * @returns {string} 格式化后的HTML
 */
export function formatMathContent(html) {
  if (!html) return ''
  
  // 将$$...$$ 转换为 \[...\] 避免某些情况下的渲染问题
  const formatted = html.replace(/\$\$([\s\S]*?)\$\$/g, '\\[$1\\]')
  
  return formatted
}

export default {
  loadMathJax,
  renderMathJax,
  safeRenderMathJax,
  formatMathContent
} 